What are attributes of an HTML tag?

Attributes of an HTML Tag

Attributes provide additional information about an HTML element. They are always included in the opening tag and usually come in name/value pairs, such as name="value". Attributes help modify the behavior, appearance, or meaning of an element.

Example with Attributes

Common HTML Attributes

1
id – uniquely identifies an element
2
class – assigns a class for styling or scripting
3
src – specifies the source file (e.g., images, scripts)
4
href – specifies the link URL
5
alt – provides alternative text for images
6
title – gives additional information shown as a tooltip
7
style – allows inline CSS styling
8
width/height – defines element dimensions
9
disabled – makes form elements uneditable or unclickable

Difficulty: 3/10

Topics: global attributes, data attributes, ARIA attributes

Scenario Questions

0-2 years experience

1
You need to add a tooltip to a button using only HTML. Which attribute would you use and why?
2
If you write <div class="card" without closing the tag, what happens to the class attribute when the browser parses the page?

2-5 years experience

1
Your teammate added a data-user-id attribute to a div, but it doesn't appear in the DOM inspector. Walk me through how you'd debug the issue.
2
We need to make an image accessible for screen readers. Which attributes would you add to the <img> tag and what trade‑offs should we consider?
3
During a refactor, the type="email" attribute was removed from an <input> and the form started accepting invalid data. Explain why that attribute matters.

5-8 years experience

1
We're building a component library used across many products. How would you decide which HTML attributes to expose as component props, and how would you handle deprecating old ones?
2
Our analytics team wants to add data- attributes to every interactive element without bloating the markup. What strategies would you use to manage attribute size and performance at scale?
3
When implementing server‑side rendering for a large SPA, how do you ensure that boolean attributes are rendered correctly to avoid hydration mismatches?

8+ years experience

1
Our organization is migrating legacy pages that heavily use inline event attributes like onclick. How would you plan the migration to preserve functionality while moving to a modern framework?
2
We need to define a company‑wide HTML attribute naming convention that works across multiple front‑end stacks and supports accessibility. What factors would you consider and how would you enforce it?

Follow-up Questions

❓Which attribute would you choose for storing custom metadata and why?
❓How do boolean attributes differ from regular ones in the markup?
❓What impact do ARIA attributes have on screen readers?